<template>
  <div class="index">


    <!-- <Search></Search> -->
  
    <!-- 轮播图 -->
    <!-- <Swiper1></Swiper1> -->

    <!-- 列表 -->
    <!-- <List1></List1> -->
    <router-view></router-view>

  
      <!-- Tabbar -->
      <!-- <Tabbar></Tabbar> -->
      <!-- 底部导航 -->
    <div class="tabbar">
    <!-- <div class="btn" v-for="(item,index) in tablist" :key="index" @click="handleClick(index)">
        <img :src="item.pic" alt="">
        <span>{{item.text}}</span>
    </div> -->
    <router-link to="/index/home">首页</router-link>
    <router-link to="/index/tuan">爆爆团</router-link>
    <router-link to="/index/order">订单</router-link>
    <router-link to="/index/mine">我的</router-link>
  </div>
  
  </div>
</template>

<script>
export default {

}
</script>

<style lang='scss' scoped>
.tabbar{
  display: flex;
  justify-content: space-around;
  align-items: center;
  position: fixed;
  bottom: 0;
  width: 100%;
  padding: 10px 0;
  border-top: 1px solid #ccc;
  background-color: #fff;
}  

/* 入场动画 */
/* .fade-enter{ 动画开始时的状态 */
  /* // opacity: 0; */
  /* transform:scale(0); */
  /* // transform:rotate(0deg); */
  /* transform:scale(0) rotate(0deg); */
/* } */
/* .fade-enter-active{ */
  /* transition: all 0.2s; */
/* } */
/* .fade-enter-to{ 动画结束时的状态 */
  /* opacity: 1; */
  /* transform:scale(1); */
  /* // transform:rotate(360deg); */
  /* transform:scale(1) rotate(360deg); */
/* } */

/* 离场动画 */
/* .fade-leave{ 动画开始时的状态 */
  /* opacity: 1; */
  /* transform:scale(1) rotate(360deg); */
  /* // transform:rotate(360deg); */
/* } */
/* .fade-leave-active{ */
  /* transition: all 0.2s; */
/* } */
/* .fade-leave-to{ 动画结束时的状态 */
  /* opacity: 0; */
  /* transform:scale(0) rotate(0deg); */
  /* // transform:rotate(0deg); */
/* } */
</style>